<template>
    <div>
        <navigation-bar>
            <div class="searchContent">
                <el-input v-model="userName" placeholder="请输入用户名称" size="mini" style="width: 150px; margin-right: 10px"></el-input>
                <el-date-picker
                    size="mini"
                    v-model="value1"
                    type="daterange"
                    range-separator="至"
                    start-placeholder="开始日期"
                    end-placeholder="结束日期"
                >
                </el-date-picker>

                <el-select
                    v-model="device_type"
                    clearable
                    placeholder="请选择"
                    size="mini"
                    style="width: 150px; margin-right: 10px; margin-left: 10px"
                >
                    <el-option v-for="item in device_typeList" :key="item.value" :label="item.label" :value="item.value" width="150px">
                    </el-option>
                </el-select>

                <custom-button type="search" style="margin-right: 10px" @searchClick="searchClick"></custom-button>
                <custom-button type="download" @downloadClick="dcData" title="导出" style="margin-right: 10px"></custom-button>
                <custom-button type="print" title="打印"></custom-button>
            </div>
        </navigation-bar>
        <table-index
            :dataSource="dataSource"
            :tableColumns="tableColumns"
            :btnList="btnList"
            :pageSize="pageSize"
            :pageCount="pageCount"
            :pageNo="pageNo"
            @pageChange="pageChange"
            @handleSelectionChange="handleSelectionChange"
        ></table-index>

        <div v-if="dialogShow">
            <custom-dialog :title="dialogTitle" size="large" @dialogClose="dialogClose"> 1111 </custom-dialog>
        </div>
    </div>
</template>

<script>
import customDialog from '@/components/customComponents/customDialog'
import customButton from '@/components/customComponents/customForm/customButton'
import tableIndex from '@/components/customComponents/customeTable/tableIndex'
import navigationBar from '@/components/customComponents/managementCenter/navigationBar'
// AjaxCommon
import {printAddress} from '@/libs/apiCommon'
import {CardId} from '@/libs/cardId'
import {PopupCommon} from '@/libs/popupCommon'
import {SessionCommon} from '@/libs/sessionCommon'
import {Utility} from '@/libs/utility'
import {loginLogList} from '@/mockData/systemManage.js'
export default {
    components: {
        navigationBar,
        customButton,
        tableIndex,
        customDialog
    },
    data() {
        return {
            userName: '',
            value1: '',
            selectDeviceList: [],
            unitName: '',
            device_type: '',
            device_typeList: Utility.getDictList('formatType'),
            status: '',
            statusList: Utility.getDictList('status'),
            // table 相关参数  begin
            dataSource: loginLogList,
            tableColumns: [
                {
                    prop: 'username',
                    label: '用户名称'
                },
                {
                    prop: 'logintime',
                    label: '登录时间'
                },
                {
                    prop: 'ipAddress',
                    label: 'IP所在地'
                },
                {
                    prop: 'target',
                    label: '目标'
                },
                {
                    prop: 'ip',
                    label: 'IP地址'
                },
                {
                    prop: 'loginouttime',
                    label: '退出时间'
                },
                {
                    prop: 'ly',
                    label: '登录来源'
                }
            ],
            btnList: [],
            pageSize: 20,
            pageCount: 3,
            pageNo: 1
            // table 相关参数  end
        }
    },

    methods: {
        customClick(type) {
            if (this.selectDeviceList.length < 1) {
                PopupCommon.notify('info', '请选择至少一个机构')
                return
            }
            PopupCommon.notify('success', type == 1 ? '启用成功' : '禁用成功')
        },

        handleSelectionChange(d) {
            this.selectDeviceList = d
        },
        printClick() {
            console.log(1111)
            let urlAdd = `${printAddress}/ccdc/tmrreport/pdf/show?1=1&_u=file:shebeibqV1.tmrreport.xml&_i=1&_r=1
`
            if (this.selectDeviceList.length > 0) {
                let ids = this.selectDeviceList
                    .map((t) => {
                        return t.id
                    })
                    .join(',')
                if (this.selectDeviceList.length < 2) {
                    urlAdd += '&id=' + ids
                } else {
                    urlAdd += '&ids=' + ids
                }
            }
            console.log(urlAdd)
            window.open(urlAdd)
        },
        formInputChange(e) {
            if (e.filedName == 'idCard') {
                const data = CardId.getInfoByCardId(e.value)
                if (data) {
                    let newData = e.allData
                    newData['birthday'] = data.birthday
                    newData['sex'] = data.sex
                    this.$refs.form.changeFormValue(newData)
                }
            }
        },

        dialogClose() {
            this.dialogShow = false
        },
        dcData() {},
        searchClick() {
            this.pageNo = 1
            this.initPage()
        },
        resetClick() {
            this.unitName = ''
            this.device_type = ''
        },
        addClick() {
            let formConfigItem = this.formConfig
            formConfigItem.map((t) => {
                Object.keys(t).map((res) => {
                    if (res == 'fieldName') {
                        t.filedValue = ''
                    }
                })
            })
            this.formConfig = formConfigItem
            this.type = 'add'
            this.dialogShow = true
            this.dialogTitle = '新增' + JSON.parse(SessionCommon.getCurrentMenuInfo()).title
        },
        // 分页点击事件
        pageChange(p) {
            this.pageNo = p
            this.initPage()
        },

        // 初始化事件
        initPage() {
            //   let self = this;
            //   AjaxCommon("/ccdc/cfg/device/device/listByPage", "post", {
            //     unitName: this.unitName,
            //     deviceStatus: this.status,
            //     deviceType: this.device_type,
            //     pageNo: this.pageNo,
            //     pageSize: this.pageSize,
            //   }).then((res) => {
            //     if (res.data.code == 200) {
            //       self.dataSource = res.data.result.records;
            //       self.pageCount = res.data.result.total;
            //     } else {
            //       PopupCommon.notify("error", res.data.message);
            //     }
            //   });
        }
    },
    mounted() {
        this.initPage()
    }
}
</script>

<style lang="scss" scoped>
.deviceTitle {
    color: #333;
    float: right;
    label {
        font-size: 14px;
        float: left;
        margin-right: 10px;
    }
    img {
        width: 16px;
        float: left;
        margin-top: 10px;
        margin-right: 4px;
    }
}
</style>
